<template>
    <basic-container>
        <avue-crud :option="option"
                   :data="data"
                   ref="crud"
                   v-model="form"
                   :table-loading="loading"
                   :permission="permissionList"
                   :page="page"
                   @refresh-change="refreshChange"
                   @search-change="searchChange"
                   @search-reset="searchReset"
                   @current-change="currentChange"
                   @size-change="sizeChange"
                   @on-load="onLoad">
            <template slot-scope="{row}"
                      slot="status">
                <el-switch @change="rowSwitchChange(row)"
                           v-model="row.status"
                           active-value="ENABLE"
                           inactive-value="DISABLE">
                </el-switch>
            </template>

            <template slot-scope="{row,type,size}"
                      slot="menu">
                <el-button :type="type"
                           :size="size"
                           icon="el-icon-refresh-right"
                           @click="earnDetail(row.userId)">紫微星详情</el-button>
            </template>
        </avue-crud>

        <el-dialog title="紫微星详情"  width="80%" :visible.sync="dialogVisibleB">
            <avue-crud :option="optionB" :data="resucedataB"  v-model="formB" :table-loading="loading"
                       :page="pageB" @refresh-change="refreshChangeB" @search-change="searchChangeB" @current-change="currentChangeB" @size-change="sizeChangeB">
            </avue-crud>
        </el-dialog>

    </basic-container>
</template>
<script>
    import {getBuyerList,getIntegralList} from "@/api/minmao/mgr/userMgr";
    import { mapGetters } from "vuex";
    import {
        testPhone
    } from '@/util/util';
    var Dict = JSON.parse(localStorage.getItem('mall-dictionary')).content;
    export default {
        watch:{
        },
        data () {
            return {
                addLoadU:false,
                flag:true,
                userFrom:{},
                display: true,
                dialogVisible:false,
                dialogVisibleB:false,
                form: {},
                formB:{},
                checkdata: [],
                query: {},
                queryB: {},
                loading: true,
                page: {
                    pageSize: 10,
                    currentPage: 1,
                    total: 0
                },
                pageT: {
                    pageSize: 10,
                    currentPage: 1,
                    total: 0
                },
                pageB: {
                    pageSize: 10,
                    currentPage: 1,
                    total: 0
                },
                option: {
                    size: 'mini',
                    tip: false,
                    border: true,
                    index: true,
                    rowKey: 'userId',
                    height: 'auto',
                    // calcHeight: 380,
                    addBtn: false,
                    delBtn: false,
                    editBtn: false,
                    viewBtn: false,
                    dialogType: 'dialog',
                    menuWidth: 240,
                    searchMenuSpan:6,
                    column: [
                        {
                            label: "账号",
                            prop: "account",
                            search: true,
                            fixed: true,
                            rules: [{
                                required: true,
                                message: "请输入账号",
                                trigger: "blur"
                            } ]
                        },
                        {
                            label: '手机号',
                            prop: 'phone',
                            width: 120,
                            rules: [{
                                required: true,
                                message: "请输入电话",
                                trigger: "blur"
                            },
                                {
                                    validator: testPhone,
                                    trigger: 'blur'
                                },
                            ]
                        },
                        {
                            label: "密码",
                            prop: "password",
                            type: 'password',
                            hide: true,
                            rules: [{
                                required: true,
                                message: "请输入密码",
                                trigger: "blur"
                            }]
                        },
                        {
                            label: "姓名",
                            prop: "name",
                            rules: [{
                                required: true,
                                message: "请输入姓名",
                                trigger: "blur"
                            }]
                        },
                        {
                            label: "账号状态",
                            prop: "status",
                            slot: true,
                            type: 'switch',
                            dicData: [
                                {
                                    label: "关闭",
                                    value: 'DISABLE'
                                },
                                {
                                    label: "开启",
                                    value: 'ENABLE'
                                },
                            ],
                        },
                        {
                            label: "上级",
                            prop: "parentName",
                        },
                        {
                            label: "上级类型",
                            prop: "parentRoleName",
                            width: 180,
                        },
                        {
                            label: "所属线下店",
                            prop: "belongOffLineStoreName",
                            width: 180,
                        }
                    ]
                },
                optionB: {
                    page: true,
                    size: 'mini',
                    tip: false,
                    border: true,
                    index: true,
                    rowKey: 'userId',
                    height: 'auto',
                    // calcHeight: 380,
                    addBtn: false,
                    delBtn: false,
                    editBtn: false,
                    viewBtn: false,
                    dialogType: 'dialog',
                    menuWidth: 240,
                    menu:false,
                    column: [
                        {
                            label: "创建时间",
                            prop: "addTime",
                        },
                        {
                            label: "金额",
                            prop: "integral",
                        },
                        {
                            label: "类型",
                            prop: "tradeType",
                            dicData: Dict.integralTradeTypeEnum,
                        },
                        {
                            label: "状态",
                            prop: "lockStatus",
                            dicData: Dict.lockStatusEnum,
                        },
                        {
                            label: "描述",
                            prop: "subject",
                        },
                    ]
                },
                resucedataB: [],
                data: []
            };
        },
        computed: {
            ...mapGetters(["permission", 'userInfo']),
            permissionList () {
                return {

                };
            },
        },
        methods: {
            refreshChangeB() {
                this.onLoadB(this.pageB);
            },
            searchChangeB (params,done) {
                this.query = params;
                this.onLoadB(this.pageB, this.query,done);
            },
            currentChangeB(currentPage) {
                this.pageB.currentPage = currentPage;
                this.onLoadB(this.pageB);
            },
            //  监听pageSize改变
            sizeChangeB (pageSize) {
                this.pageB.pageSize = pageSize;
                this.onLoadB(this.pageB);
            },
            //收益详情弹框的页面加载
            onLoadB (pageB, params = {},done) {
                getIntegralList(pageB.currentPage, pageB.pageSize, Object.assign(params, this.query)).then(res => {
                    if(done){
                        done();
                    }
                    if(res.status==200){
                        this.resucedataB = [];
                        const data = res.data;
                        this.pageB.total = data.count;
                        this.resucedataB = data.data;
                    }
                });
            },
            handleEmpty(){
                this.$refs["diaformRef"].resetForm();
                this.addLoadU=false
            },
            editHandleEmpty(){
                this.$refs["diaEditFormRef"].resetForm();
            },
            //账号状态改变
            rowSwitchChange (row) {
                if (row.status === 'ENABLE') {
                    changeStatus(row.userId, 'unfreeze');
                } else {
                    changeStatus(row.userId, 'freeze');
                }
            },
            searchReset () {
                this.query = {};
                this.onLoad(this.page);
            },
            //弹窗关闭
            closeDialog () {
                this.checkdata = [];
                this.dialogVisible = false;
            },
            searchChange (params,done) {
                //每次搜索，都从第一页开始查询
                this.page.currentPage=1;
                this.query = params;
                this.onLoad(this.page, params,done);
            },
            //收益详情
            earnDetail (id) {
                this.dialogVisibleB = true;
                this.query.userId = id;
                this.onLoadB(this.pageB);
            },
            currentChange (currentPage) {
                this.page.currentPage = currentPage;
            },
            sizeChange (pageSize) {
                this.page.pageSize = pageSize;
            },
            refreshChange () {
                this.onLoad(this.page);
            },
            onLoad (page, params = {},done) {
                this.loading = true;
                getBuyerList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
                    if(done){
                        done();
                    }
                    this.loading = false;
                    const data = res.data;
                    this.page.total = data.count;
                    this.data = data.data;
                });
            }
        }
    };
</script>

<style>
</style>
